{%- import "apostrophe-ui:components/fields.html" as fields -%}
{%- import "apostrophe-ui:components/buttons.html" as buttons -%}
{% for piece in data.pieces -%}
  <div class="apos-manage-grid-piece" data-focus-{{ piece.type }} data-edit-dbl-{{ data.options.name | css }}="{{ piece._id }}" data-piece="{{ piece._id }}">
    <div class="apos-manage-grid-image">
      {# Trash only has access to very low fi version of image, by design.
        Other sizes will 404. Might not seem so due to your cache at first. -Tom #}
      <img src="{{ apos.attachments.url(piece.attachment, { size: (piece.trash and 'one-sixth') or 'one-third' } ) }}" alt="">
      <div class="apos-image-screen"></div>
      <div class="apos-manage-grid-piece-controls">
        {% set verb = 'rescue' if (piece.trash and not (data.canEditTrash)) else 'edit' %}
        {% set label = 'Rescue' if (verb == rescue) else 'Edit' %}
        {{ buttons.minor(label, { action: verb + '-' + data.options.name | css, value: piece._id, icon: 'caret-right' }) }}
      </div>
    </div>
    <div class="apos-manage-grid-piece-label">{{ piece.title }}</div>
    {{ fields.checkbox(data.options.name + '-select') }}
  </div>
{%- endfor %}
